<template>
  <div>
    <br/>
    <el-row :gutter="20" class="conclusion">
      <el-col :span="6">学校总数：{{this.num.school_number}}</el-col>
      <el-col :span="6">学生总数：{{this.num.student_number}}</el-col>
    </el-row>
    <div class="table">
      <el-table :data="tableData" row-key="id" lazy :load="load" border :tree-props="{children: 'child'}" size="small">
        <el-table-column align="center" prop="name" label="区域"> </el-table-column>
        <el-table-column align="center" prop="school_number" label="测评学校"> </el-table-column>
        <el-table-column align="center" prop="student_number" label="学生人数"> </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import {GETEVALUATIONLIST} from '@/common/api.js'
export default {
  props: ['form'],
  data () {
    return {
      tableData: [],
      num: {
        school_number: '',
        student_number: ''
      }
    }
  },
  created () {
    this.tableList()
  },
  methods: {
    tableList () {
      this.form.id = ''
      GETEVALUATIONLIST(this.form).then((res) => {
        if (res.data !== null) {
          if (res.data) {
            this.tableData = res.data
          }
          this.num.school_number = res.sum.school_number
          this.num.student_number = res.sum.student_number
        } else {
          this.tableData = []
        }
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    load (tree, treeNode, resolve) {
      // console.log(tree)
      // // console.log(treeNode)
      // console.log(resolve)
      GETEVALUATIONLIST({
        id: tree.id
      }).then((res) => {
        if (res.data !== null) {
          resolve(res.data)
        }
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    }
  }
}
</script>
